import React from 'react';
import axios from 'axios';
import TableView from './table';
import Filter from './filter';

class HardwareAlarm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      tableData: [],
      total: 0,
      pageNum: 1,
      filterInfo: undefined
    };
  }

  componentDidMount() {
    this.getData();
  }

  getData = () => {
    const { filterInfo = {} } = this.state;
    const {
      serverTag = '', status = '', serverName = ''
    } = filterInfo;
    const { pageNum } = this.state;

    axios.get(
      `/aiOps/cloudService/cloudServices/${pageNum}/100?name=${serverName}&prefix=&status=${status === 'all' ? '' : status}&tag=${serverTag}`
    ).then((res) => {
      const { data = {} } = res.data || {};
      this.setState({
        tableData: data.datas || [],
        total: data.totalRecord
      });
    });
  };

  changePage = (num) => {
    this.setState({ pageNum: num }, () => {
      this.getData({});
    });
  };

  filter = (filterInfo) => {
    this.setState({ filterInfo }, () => {
      this.getData();
    });
  };

  clearFilter = () => {
    this.setState({ filterInfo: undefined }, () => {
      this.getData();
    });
  };

  render() {
    const { tableData = [], total } = this.state;
    return (
      <>
        <Filter filter={this.filter} clearFilter={this.clearFilter} />
        <TableView changePage={this.changePage} tableData={tableData} total={total} />
      </>
    );
  }
}

export default HardwareAlarm;
